﻿@charset "UTF-8";
/*-----------------------------------------------------------------------------
 [TABLE OF CONTENTS]
    +content
        +crumb
        +content-main
            //content-single單欄//
            +products-content
                =bookmarker
                =show
                                
            //content-double雙欄//
            +submenu
                =class
                =search
                =tag
                =express
              =google
            +main                
                =bookmarker                
                =subnav
                =products
                =ad                
                =discuss                
            +main-down      
-----------------------------------------------------------------------------*/

/* +content
*----------------------------------------------------------------------------*/
/* +content-main
*----------------------------------------------------------------------------*/
/* +products-content
*----------------------------------------------------------------------------*/

#content-main .products-content {
    position: relative;    
    width: 745px;
    overflow: hidden;
    background: url('../../i/content_bg_t.gif') no-repeat;
}

#content-main .products-content .header {
    position: absolute;
    top: 0;
    left: 0;
    width: 160px;
    height: 53px;
    z-index: 100;
}

#content-main .products-down {
    float: left;
    bottom: -1px;
    width: 745px;
    background: url('../../i/content_bg_t.gif') no-repeat;
}

/**
 *
 * =bookmarker 
 *
 **/

#content-main .products-content .bookmarker {
    font: 12px/21px Arial;
    width: 715px;
    height: 38px;
    padding: 15px 15px 0 15px;
    text-align: right;
}

#content-main .products-content .bookmarker ul li {
    display: inline;
    margin: 0 2px 0 0;    
}

/**
 *
 * =show 
 *
 **/

#content-main .products-content .show {
    position: relative;
    width: 685px;
    margin: 0 40px;
}

#content-main .products-content .show h2 {
    font: bold 20px/22px Arial;
    color: #696969;
}

#content-main .products-content .show h2 span {
    color: #6299C3;
}

#content-main .products-content .show p {
    text-align: center;
    margin: 0 auto;
}

#content-main .products-content .show ul {
    text-align: center;
}


#content-main .products-content .show ul li {
    display: inline;
    padding: 0 20px 0 5px;
    text-align: center;
    background: url('../../i/l_03l.gif') no-repeat right center;
}

#content-main .products-content .show ul li img {
    vertical-align: middle;
}

#content-main .products-content .show ul li.list {
    background: none;
    padding: 0;
}

#content-main .products-content .show ol {
    padding: 0 0 0 40px;
}


#content-main .products-content .show ol li {
    display: inline;
    padding: 0 5px 0 8px;
    text-align: center;
    font: 13px/22px Verdana;
    background: url('../../i/l_032.gif') no-repeat right center;
}

#content-main .products-content .show ol li.list {
    background: none;
}


#content-main .products-content .show h3 {
    font: bold 15px/22px Arial;
    margin: 0 0 20px 0;
}

/* +content
*----------------------------------------------------------------------------*/
/* +content-main
*----------------------------------------------------------------------------*/
/* +submenu
*----------------------------------------------------------------------------*/

#content-main .submenu {
    float: left;
    bottom: -1px;
    width: 160px;
    background: url('../../i/content_bg_t_01.gif') no-repeat right top;
}

/**
 *
 * =class
 *
 **/

#content-main .submenu .class {
    float: left;
    bottom: -1px;
    width: 140px;
    padding: 0 10px;
    margin: 10px 0 0 0;    
}

#content-main .submenu .class h2 { 
    font: 13px/25px Verdana;
    _font: 13px/28px Verdana;
    margin: 0 0 5px 0;
    _margin: 0 0 0 0;
    padding: 0 0 0 10px;
    background: url('../../i/content_l_t.gif') no-repeat;
}

#content-main .submenu .class ul li {
    padding: 0 0 0 10px;
    margin: 0 10px;    
    background: url('../../i/i02.gif') no-repeat 0 5px;
    font: 12px/18px Verdana;
}

/**
 *
 * =search
 *
 **/

#content-main .submenu .search {
    float: left;
    bottom: -1px;
    width: 140px;
    padding: 0 10px 1px 10px;
    margin: 10px 0 0 0;
}

#content-main .submenu .search h2 {
    font: 13px/25px Verdana;
    _font: 13px/28px Verdana;
    margin: 0 0 5px 0;
    _margin: 0 0 0 0;
    padding: 0 0 0 10px;
    background: url('../../i/content_l_t.gif') no-repeat;
}

#content-main .submenu .search ul li {    
    padding: 0 0 0 10px;
    margin: 0 10px;
    background: url('../../i/i02.gif') no-repeat 0 5px;
    font: 12px/18px Verdana;
}

#content-main .submenu .search label {
    display: block;
}

#content-main .submenu .search ul li.list {    
    background: none;
}

/**
 *
 * =tag
 *
 **/

#content-main .submenu .tag {
    float: left;
    bottom: -1px;
    width: 140px;
    padding: 0 10px;
    margin: 10px 0 0 0;
}

#content-main .submenu .tag h2 {
    font: 13px/25px Verdana;
    _font: 13px/28px Verdana;
    margin: 0 0 5px 0;
    _margin: 0 0 0 0;
    padding: 0 0 0 10px;
    background: url('../../i/content_l_t.gif') no-repeat;
}

#content-main .submenu .tag ul {
    margin: 0 10px;
}

#content-main .submenu .tag ul li {
    display: inline;
    height: 22px;
    margin: 0 5px 0 0;
    padding: 0 5px 0 0;
    font: 12px/22px Verdana;
}

#content-main .submenu .tag ul li.rank1 a {
	color: #f39700;
	font: bold 19px/22px Verdana;
}
#content-main .submenu .tag ul li.rank2 a {
	color: #f39700;
	font: bold 17px/22px Verdana;
}
#content-main .submenu .tag ul li.rank3 a {
	color: #009966;
	font: bold 15px/22px Verdana;
}
#content-main .submenu .tag ul li.rank4 a {
	font: 13px/22px Verdana;
	color: #0099cc;
}
#content-main .submenu .tag ul li.rank5 a {
	font: 12px/22px Verdana;
	color: #696969;
}

/**
 *
 * =express
 *
 **/

#content-main .submenu .express {
    font: 12px/22px Verdana;
    float: left;
    bottom: -1px;
    width: 160px;
    margin: 10px 0 0 0;
    background: url('../../i/t_hot2_m.gif') repeat-y 5px 0;
    overflow: hidden;
}

#content-main .submenu .express .top {
    float: left;
    width: 160px;
    height: 58px;
    background: url('../../i/t_hot3.gif') no-repeat 5px 0;
}

#content-main .submenu .express .down {
    float: left;
    width: 160px;
    height: 17px;
    background: url('../../i/t_hot2_d.gif') no-repeat 5px 0;
}

#content-main .submenu .express ul {
    text-align: center;
}

#content-main .submenu .express ul li {
    margin: 5px 15px 0 15px;
    border-bottom: 1px #ccc;
}

#content-main .submenu .express ul li.dot {
    margin: 5px 15px 0 15px;
    border-bottom: 1px dotted #ccc;
}

#content-main .submenu .express ul li a:hover {
    color: #1a549e;
}

#content-main .submenu .express ul li a {
    color: #1a549e;
}

/**
 *
 * =google
 *
 **/

#content-main .submenu .google {
    float: left;
    bottom: -1px;
    width: 160px;
    margin: 10px 0 0 0;
    padding: 0 0 1px 0;
}

#content-main .submenu .google P {
    text-align: center;
}


/* +content
*----------------------------------------------------------------------------*/
/* +content-main
*----------------------------------------------------------------------------*/
/* +main
*----------------------------------------------------------------------------*/

#content-main .main {
    float: right;
    bottom: -1px;
    width: 585px;
    background: url('../../i/content_bg_t_02.gif') no-repeat left top;
}

/**
 *
 * =bookmarker
 *
 **/


#content-main .main h2 {
    padding: 10px 0 0 5px;
    font: bold 21px/22px Arial, sans-serif;
    color: #6299c3;
}

#content-main .main .bookmarker {
    font: 12px/21px Arial;
    width: 555px;
    height: 38px;
    padding: 15px 15px 0 15px;
    text-align: right;
}

#content-main .main .bookmarker ul li {
    font: 12px/21px Arial;
    display: inline;
    margin: 0 2px 0 0;    
}

/**
 *
 * =subnav
 *
 **/

#content-main .main .subnav {
    position: relative;
    width: 565px;
    height: 27px;
    margin: 0 20px 0 0;
    text-align: right;
    background: url('../../i/content_m_bottom.gif') repeat-x 50% bottom;
}

#content-main .main .subnav p {
    position: relative;
    bottom: -4px;
}

#content-main .main .subnav ul {
    position: absolute;
    bottom: 0;
    _bottom: -1px;
    left: 0;
}

#content-main .main .subnav ul li {
    float: left;
    bottom: -1px;
    text-align: center;
}

#content-main .main .subnav ul li a {
    display: block;
    width: 99px;
    height: 25px;
    _height: 20px;
    padding-top: 10px;
    _padding-top: 15px;
    font-size: 13px;
    color: #666;
    text-decoration: none;
    background: url('../../i/content_m02.gif') no-repeat;
}

#content-main .main .subnav ul li a:hover {
    color: #438FCE;
    background: url('../../i/content_m01.gif') no-repeat;
}

#content-main .main .subnav ul li.active a:hover {
    display: block;
    width: 99px;
    height: 25px;
    _height: 20px;
    padding-top: 10px;
    _padding-top: 15px;
    font-size: 13px;
    color: #438FCE;
    text-decoration: none;
    background: url('../../i/content_m01.gif') no-repeat;
}

#content-main .main .subnav ul li.active a {
    display: block;
    width: 99px;
    height: 25px;
    _height: 20px;
    padding-top: 10px;
    _padding-top: 15px;
    font-size: 13px;
    color: #438FCE;
    text-decoration: none;
    background: url('../../i/content_m01.gif') no-repeat;
}

/**
 *
 * =products
 *
 **/

#content-main .main .products {
    position: relative;
    width: 580px;
    height: 320px;
    margin: 5px 5px 0 0;
    background: url('../../i/bg-products.gif') no-repeat;
}

#content-main .main .products .box {
    position: relative;
    width: 470px;
    height: 197px;
    padding: 10px 100px 10px 10px;
    background: url('../../i/bg-products.gif') no-repeat;
    font: 13px/22px Verdana;
    color: #696969;
}

#content-main .main .products .box img {
    float: left;
    bottom: -1px;
    margin: 10px;
}

#content-main .main .products .box h3 {
    padding: 20px 0 0 0;
    font: bold 15px/22px Verdana;
    color: #000;
}

#content-main .main .products .box .score {
    position: absolute;
    top: 70px;
    right: 0;
    width: 100px;
}

#content-main .main .products .box-menu {
    font: 13px/25px Verdana;
    position: relative;
    width: 580px;
    height: 103px;
    background: url('../../i/bg-products-footer.gif') no-repeat;
}

#content-main .main .products .box-menu ul {
    margin: 0 0 0 10px;
}

#content-main .main .products .box-menu ul li {
    float: left;
    bottom: -1px;
    text-align: center;
}

#content-main .main .products .box-menu ul li a {
    display: block;
    width: 99px;
    height: 94px;
    padding: 10px 20px 0 20px;
    text-align: center;
    background: url('../../i/o1_d02.gif') no-repeat;
}

#content-main .main .products .box-menu ul li a:hover {
    display: block;
    width: 99px;
    height: 94px;
    padding: 10px 20px 0 20px;
    background: url('../../i/o1_d01.gif') no-repeat;
}

/**
 *
 * =ad
 *
 **/

#content-main .main .ad {
    position: relative;
    width: 580px;
    margin: 10px 0 0 5px;
}

/**
 *
 * =discuss
 *
 **/

#content-main .main .discuss {
    position: relative;
    width: 565px;
    margin: 10px 10px 0 10px;
}

#content-main .main .discuss h3 {
    position: relative;
    height: 28px;
    padding: 0 0 0 25px;
    font: 13px/28px Verdana;
    color: #000;
    background: url('../../i/i05.gif') no-repeat;
}

#content-main .main .discuss h3 span {
    position: absolute;
    right: 10px;
    top: 5px;
}

#content-main .main .discuss p {
    position: relative;
    height: 28px;
}

#content-main .main .discuss p span {
    position: absolute;
    right: 10px;
    top: 1px;
}

#content-main .main .discuss .box {
    display: block;
    width: 544px;
    margin: 3px auto 0 auto;
    padding: 20px 0 0 0;
    background: url('../../i/bg-discuss-top.gif') no-repeat 50% top;
}

#content-main .main .discuss .box .box-main {
    display: block;
    width: 524px;
    margin: 0 auto;
    padding: 0 0 10px 20px;
    /* padding: 0 0 0 20px; */ /* 取消分頁後使用 */
    background: url('../../i/bg-discuss-down.gif') no-repeat 50% bottom;
    font: 13px/22px Verdana;
}

#content-main .main .discuss .box p {
    text-align: center;
}

#content-main .main .discuss .box .box-main table.tab-discuss {
    width: 504px;
    margin: 20px 0 10px 0;
    font: 13px/22px Verdana;
    color:#696969;
}

#content-main .main .discuss .box .box-main table.tab-discuss a,
#content-main .main .discuss .box .box-main table.tab-discuss a:hover {
    color:#000;
}

#content-main .main .discuss .box .box-main table.tab-discuss td {
    padding: 5px 0;
    background: url('../../i/l_05b.gif') repeat-x 50% bottom;
}

#content-main .main .discuss .box .box-main table.tab-discuss td table.tab-discuss-box {
    width: 100%;
}

#content-main .main .discuss .box .box-main table.tab-discuss td table.tab-discuss-box th {
    font: 13px/22px Verdana;
    text-align: left;
    width: 300px;
}

#content-main .main .discuss .box .box-main table.tab-discuss td table.tab-discuss-box td {
    padding: 2px 0;
    background: none;
}

#content-main .main .discuss .box .box-main table.tab-discuss td table.tab-discuss-box th.admin,
#content-main .main .discuss .box .box-main table.tab-discuss td table.tab-discuss-box td.admin {
    background: #e5f6ff;
}

#content-main .main .discuss .box .box-main table.tab-discuss td table.tab-discuss-box th.fw,
#content-main .main .discuss .box .box-main table.tab-discuss td table.tab-discuss-box td.fw {
    background: #f3f3f3;
}

#content-main .main .discuss .box .box-main table.tab-discuss td table.tab-discuss-box th.time,
#content-main .main .discuss .box .box-main table.tab-discuss td table.tab-discuss-box td.time {
    width: 80px;
}


#content-main .main .discuss .box .box-main .tab-pager {
    position: relative;
    width: 504px;
    height: 22px;
    background: url(../../i/page_bg.gif) repeat-x;
    /*display: none;*/ /* 取消分頁專用 */
}

#content-main .main .discuss .box .box-main .tab-pager ul {
    position: absolute;    
    top: 0;
    right: 0;
    background: url(../../i/page_bg.gif) repeat-x;
}

#content-main .main .discuss .box .box-main .tab-pager ul li {
    float: left;
    width: 26px;
    height: 22px;
    padding: 0;
    margin: 0;
    border-right: 1px solid #ccc;   
    background: none;
}

#content-main .main .discuss .box .box-main .tab-pager ul li a {
    display: block;
    width: 26px;
    height: 22px;
    text-align: center;
    color: #696969;
    background: url(../../i/page_bg.gif) no-repeat;
}

#content-main .main .discuss .box .box-main .tab-pager ul li a:hover {
    color: #fff;
    background: url(../../i/page_bg2.gif) no-repeat;
    text-decoration: none;
}

#content-main .main .discuss .box .box-main .tab-pager ul li.first a {
    text-indent: -100000px;
    background: url(../../i/page_l01b.gif) no-repeat;
}

#content-main .main .discuss .box .box-main .tab-pager ul li.first a:hover {
    background: url(../../i/page_l01c.gif) no-repeat;
}

#content-main .main .discuss .box .box-main .tab-pager ul li.back a {
    text-indent: -100000px;
    background: url(../../i/page_l02b.gif) no-repeat;
}

#content-main .main .discuss .box .box-main .tab-pager ul li.back a:hover {
    background: url(../../i/page_l02c.gif) no-repeat;
}

#content-main .main .discuss .box .box-main .tab-pager ul li.next a {
    text-indent: -100000px;
    background: url(../../i/page_r02b.gif) no-repeat;
}

#content-main .main .discuss .box .box-main .tab-pager ul li.next a:hover {
    background: url(../../i/page_r02c.gif) no-repeat;
}

#content-main .main .discuss .box .box-main .tab-pager ul li.list {
    border-right: 0px solid #ccc;
}

#content-main .main .discuss .box .box-main .tab-pager ul li.list a {
    text-indent: -100000px;
    background: url(../../i/page_r01b.gif) no-repeat;
}

#content-main .main .discuss .box .box-main .tab-pager ul li.list a:hover {
    background: url(../../i/page_r01c.gif) no-repeat;
}

#content-main .main .discuss .box .box-main .tab-pager ul li.active a,
#content-main .main .box .box-main .tab-pager ul li.active a:hover {
    display: block;
    width: 26px;
    height: 22px;
    text-align: center;
    color: #fff;
    background: url(../../i/page_bg2.gif) no-repeat;
    text-decoration: none;
}
