/*-----------------------------------------------------------------------------
 [TABLE OF CONTENTS]
    +content
        +content-main
            +exam 
                =cosmetics
                =food
                =result
                =pager
-----------------------------------------------------------------------------*/

/* +content
*----------------------------------------------------------------------------*/
/* +content-main
*----------------------------------------------------------------------------*/

/**
 *
 * +exam 
 *
 **/

#content-main .exam {
    margin: 0 0 5px 0;
    *margin: 0 0 5px 0;
    _margin: 0 0 5px 0;
}

#content-main .exam h1 {
    height: 38px;
    background: url(../../i/bg-beauty-exam-h1.gif) no-repeat;
    text-indent: -100000px;
}

/**
 *
 * =shopbox 
 *
 **/
#content-main .exam .exambox {
    width: 704px;
    margin: 5px auto 0 auto;
    _margin: 5px auto 0 auto;
    padding: 10px 10px 0 10px;
}
#content-main .exam  .exambox p {
    color: #0083ae;
    font: 13px/22px Arial, sans-serif, "新細明體";
    padding: 0 0 0 15px;
}

#content-main .exam  .exambox p {
    color: #0083ae;
    font: 13px/22px Arial, sans-serif, "新細明體";
    padding: 0 0 0 15px;
}
#content-main .exam  .exambox p strong {
    color: #3b9ac6;
    font: bold 15px/22px Arial;
}

/**
 *
 * =tab-exam 
 *
 **/
table.tab-exam {
    width: 680px;
    margin: 10px auto 10px auto;
    font: 13px/22px Arial, sans-serif, "新細明體";
    border: 2px solid #c3f2f1;
}
table.tab-exam textarea {
    margin: 2px;
    vertical-align: middle;
}
table.tab-exam select {
    margin: 2px;
    vertical-align: middle;
}
table.tab-exam input {
    margin: 2px;
    vertical-align: middle;
}
table.tab-exam img {
    margin: 2px;
    vertical-align: middle;
}
table.tab-exam td {
    padding: 3px 10px 3px 10px;
    padding: 5px 10px 2px 10px\9;
    border-bottom: 1px solid #cfcfcf;
    border-right: 1px solid #cfcfcf;
    vertical-align: middle;
}
table.tab-exam th {
    padding: 3px 10px 3px 10px;
    padding: 5px 10px 2px 10px\9;
    border-bottom: 1px solid #cfcfcf;
    border-right: 1px solid #cfcfcf;
    vertical-align: middle;
}
table.tab-exam th {
    color: #499ebb;
    font: 13px/22px "新細明體";
    text-align: left;
    width: 290px;
}
table.tab-exam th span {
    color: #919292;
}

table.tab-exam td {
    font: 13px/22px "新細明體";
    width: 350px;
}
table.tab-exam th .no {    
    float: left;
    font: bold 13px/22px "新細明體";
}
table.tab-exam th .con {    
    float: right;
    width: 270px;
}
table.tab-exam td .no {
    float: left;
    color: #fa7083;
}
table.tab-exam td .con {
    float: right;
    width: 330px;
}
table.tab-exam td.even {
    background: #fbf9f1;
}

table.tab-exam th.even {
    background: #fbf9f1;
}

/**
 *
 * =tab-exam-q
 *
 **/
table.tab-exam-q {
    width: 680px;
    margin: 10px auto 10px auto;
    font: 13px/22px Arial, sans-serif, "新細明體";
    border: 2px solid #c3f2f1;
}
table.tab-exam-q textarea {
    margin: 2px;
    vertical-align: middle;
}
table.tab-exam-q select {
    margin: 2px;
    vertical-align: middle;
}
table.tab-exam-q input {
    margin: 2px;
    vertical-align: middle;
}
table.tab-exam-q img {
    margin: 2px;
    vertical-align: middle;
}
table.tab-exam-q td {
    padding: 3px 10px 3px 10px;
    padding: 5px 10px 2px 10px\9;
    border-bottom: 1px solid #cfcfcf;
    border-right: 1px solid #cfcfcf;
    vertical-align: middle;
}
table.tab-exam-q th {
    padding: 3px 10px 3px 10px;
    padding: 5px 10px 2px 10px\9;
    border-bottom: 1px solid #cfcfcf;
    border-right: 1px solid #cfcfcf;
    vertical-align: middle;
}
table.tab-exam-q th {
    color: #499ebb;
    font: 13px/22px "新細明體";
    text-align: left;
}
table.tab-exam-q th.no {
    color: #fa7083;
    font: 24px/24px Arial;
    text-align: center;
}
table.tab-exam-q th span {
    color: #919292;
}
table.tab-exam-q td {
    font: 13px/22px "新細明體";
    width: 355px;
}
table.tab-exam-q td .no {
    float: left;
    padding: 0 0 0 4px;
    padding: 0 0 0 0\9;
    color: #fa7083;
}
table.tab-exam-q td .con {
    float: right;
    width: 320px;
}
table.tab-exam-q td.even {
    background: #fbf9f1;
}

table.tab-exam-q th.even {
    background: #fbf9f1;
}
table.tab-exam-q ul li {
    display: block;
    clear: both;
    overflow: hidden;
    vertical-align: middle;
}

table.tab-exam-q ul li input {
    float: left;
}

/**
 *
 * =btn
 *
 **/

#content-main .exam .btn {    
    width: 690px;
    height: 20px;
    margin: 10px 0 0 0;
    *margin: 0;
    _margin: 0;
}
#content-main .exam .btn ul { 
    position: absolute;
    right: 13px;
    *right: 15px;
    _right: 1px;
}
#content-main .exam .btn ul li { 
    float: left;
    margin: 0 10px 0 0;
}
#content-main .exam .btn button.exam-r {
	float: left;
    display: block;
    width: 105px;
    height: 20px;
    background: url(../../i/btn-exam-r.gif) no-repeat;
    text-indent: -100000px;
}
#content-main .exam .btn button.exam-g {
	float: left;
    display: block;
    width: 110px;
    height: 20px;
    background: url(../../i/btn-exam-g.gif) no-repeat;
    text-indent: -100000px;
}
#content-main .exam .btn button.next-r {
    display: block;
    width: 87px;
    height: 20px;
    background: url(../../i/btn-exam-next-r.gif) no-repeat 0 0;
    text-indent: -100000px;
}

/* +content
*----------------------------------------------------------------------------*/
/* +content-main
*----------------------------------------------------------------------------*/

/**
 *
 * =recbox 
 *
 **/
#content-main .exam .recbox {
    width: 704px;
    margin: 5px auto 0 auto;
    _margin: 5px auto 0 auto;
    padding: 10px 10px 0 10px;
}
#content-main .exam  .recbox p {
    color: #424343;
    font: 13px/22px Arial, sans-serif, "新細明體";
    padding: 0 0 0 10px;
}
#content-main .exam  .recbox p.info {
    color: #8c557a;
}
#content-main .exam  .recbox p strong {
    color: #3b9ac6;
    font: bold 15px/22px Arial;
}
#content-main .exam .recbox h2 {
    margin: 0 0 10px 0;
}
#content-main .exam  .recbox p.msg {
    margin: 5px 0 0 0;
    padding: 0 0 0 15px;
    color: #677999;
    background: url(../../i/icon-recbox-msg.gif) no-repeat 5px 8px;
    background: url(../../i/icon-recbox-msg.gif) no-repeat 5px 5px\9;
}

/**
 *
 * =recbox 
 *
 **/
#content-main .exam .recbox .recmain {
    padding: 0 0 15px 0;
    margin: 15px 0 15px 0;
    display: block;
    clear: both;
    overflow: hidden;
    zoom: 1;
    border-bottom: 1px solid #e2e2e2;
}
#content-main .exam .recbox .mainbox {
    float: left;
    width: 210px;
    margin: 0 32px 0 0;
}
#content-main .exam .recbox .list {
    margin: 0 0 0 0;
}
#content-main .exam .recbox .mainbox p {
    padding: 0 5px 0 5px;
}
#content-main .exam .recbox .mainbox p.txt {
    height: 70px;
    padding: 5px 5px 0 5px;
    color: #6cb7c4;
}
#content-main .exam .recbox .mainbox p.photo {
    text-align: center;
}

#content-main .exam .recbox .mainbox p.hr {
    height: 10px;
    margin: 5px 0;
    background: url(../../i/line-05.gif) repeat-x bottom;
}

#content-main .exam .recbox .mainbox a {
    color: #319bbb;
    font: bold 13px/22px Arial;
}
#content-main .exam .recbox .mainbox a:hover {
    color: #fc87a6;
}
/**
 *
 * =recbox 
 *
 **/
#content-main .exam .recbox table.tab-spe {
    margin: 0 0 10px 0;
    border-bottom: 1px solid #e2e2e2;
}
#content-main .exam .recbox table.tab-spe td {
    padding: 10px 5px;
    border-bottom: 1px solid #c2e6f0;
    vertical-align: top;
}
#content-main .exam .recbox table.tab-spe td a {
    color: #319bbb;
    font: bold 13px/22px Arial;
}
#content-main .exam .recbox table.tab-spe td a:hover {
    color: #fc87a6;
}
#content-main .exam .recbox table.tab-spe td p.hr {
    height: 5px;
    margin: 0 10px 5px 10px;
    background: url(../../i/line-02.gif) repeat-x bottom;
}
/**
 *
 * =stepbox 
 *
 **/
#content-main .exam .recbox .stepbox {
    /*width: 675px;
    padding: 10px;
    border: 1px solid #bbb;*/
    width: 695px;
    padding: 0px;
    margin: 5px 0 0 0;
    border: 0px solid #bbb; 
}
#content-main .exam .recbox .stepbox .morning {
    padding: 0 0 10px 0;
    margin: 0 0 10px 0;
    background: url(../../i/line-05.gif) repeat-x bottom;
}
#content-main .exam .recbox .stepbox .night { 
    padding: 0 0 0 0;
    margin: 0 0 0 0;
}
#content-main .exam .recbox .stepbox img {
    vertical-align: middle;
}
/**
 *
 * =freebox 
 *
 **/
#content-main .exam .recbox .freebox {
    margin: 10px 0 0 0;
    padding: 45px 0 0 35px;
    width: 658px;
    height: 97px;    
    background: url(../../i/bg-free.gif) no-repeat;    
}
#content-main .exam .recbox .freebox p {
    padding: 0 0 5px 0;
    color: #4785ac;
}
#content-main .exam .recbox .freebox p.txt {
    color: #6e6e6e;
}
#content-main .exam .recbox .freebox p .btnfree {
    width: 154px;
    height: 30px;
    margin: 0 5px 0 0;
    background: url(../../i/btn-freebox.gif) no-repeat;
    vertical-align: middle;
}
#content-main .exam .recbox .freebox p .btnpropose {
    width: 208px;
    height: 30px;
    margin: 0 5px 0 0;
    background: url(../../i/btn-freebox2.gif) no-repeat;
    vertical-align: middle;
}

#content-main .exam .recbox .freebox p samp {
    color: #07b5c0;
}
/* +content
*----------------------------------------------------------------------------*/
/* +content-main
*----------------------------------------------------------------------------*/
/**
 *
 * =proposebox 
 *
 **/
#content-main .exam .proposebox {
    width: 704px;
    margin: 5px auto 0 auto;
    _margin: 5px auto 0 auto;
    padding: 10px 10px 0 10px;
}
#content-main .exam .proposebox h2 {
    height: 24px;
    padding: 3px 0 0 5px;
    margin: 0 0 5px 0;
    background: #93ddde;
}
#content-main .exam .proposebox p {
    padding: 3px 0 0 5px;
}
#content-main .exam .proposebox p.header {
    padding: 3px 0 0 5px;
    color: #d78843;
    font: bold 13px/22px Arial;

}
/**
 *
 * =stepbox 
 *
 **/
#content-main .exam .proposebox .stepbox {
    /*width: 675px;
    padding: 10px;
    margin: 5px 0 0 0;
    border: 1px solid #bbb;*/
    width: 695px;
    padding: 0px;
    margin: 5px 0 0 0;
    border: 0px solid #bbb;    
}
#content-main .exam .proposebox .stepbox .morning {
    padding: 0 0 10px 0;
    margin: 0 0 10px 0;
    background: url(../../i/line-05.gif) repeat-x bottom;
}
#content-main .exam .proposebox .stepbox .night { 
    padding: 0 0 0 0;
    margin: 0 0 0 0;
}
#content-main .exam .proposebox .stepbox img {
    vertical-align: middle;
}

/* +content
*----------------------------------------------------------------------------*/
/* +content-main
*----------------------------------------------------------------------------*/
/**
 *
 * =resultbox
 *
 **/
#content-main .exam .resultbox {
    width: 700px;
    margin: 5px auto 0 auto;
}
#content-main .exam .resultbox .resultbox-bd {
    width: 700px;
    margin: 0 0 10px 0;
    background: url(../../i/bg-analyze-bd.gif) repeat-y;
}
#content-main .exam .resultbox .resultbox-hd {
    width: 700px;
}
#content-main .exam .resultbox .analyze {
    background: url(../../i/bg-analyze-hd.gif) no-repeat top;
}
#content-main .exam .resultbox .result {
    background: url(../../i/bg-result-hd.gif) no-repeat top;
}
#content-main .exam .resultbox .resultbox-ft {
    width: 650px;
    padding: 50px 20px 20px 30px;
    background: url(../../i/bg-analyze-ft.gif) no-repeat bottom;
    display: block;
    clear: both;
    overflow: hidden;
    zoom: 1;
}
#content-main .exam .resultbox .resultbox-ft .con {
    position: relative;
    left: 20px;

    float: left;
    width: 310px;
    _width: 300px;
    padding: 30px 0 0 0;
}
#content-main .exam .resultbox .resultbox-ft .con2 {
    position: relative;
    left: 10px;
    width: 310px;
    _width: 300px;
}
#content-main .exam .resultbox .resultbox-ft .con p {
    padding: 0 0 5px 0;
}
#content-main .exam .resultbox .resultbox-ft .con p.header {
    color: #d78843;
    font: bold 13px/22px Arial;
    margin: 0 0 0 0;
}
#content-main .exam .resultbox .resultbox-ft .con p.header2 {
    color: #d78843;
    font: bold 13px/22px Arial;
    margin: 0 0 0 15px;
}
#content-main .exam .resultbox .resultbox-ft table.tab-water {
    width: 290px;
    margin: 0 0 5px 15px;
}
#content-main .exam .resultbox .resultbox-ft table.tab-water td {
    padding: 2px 0;
    text-align: center;
}
#content-main .exam .resultbox .resultbox-ft .con .case-bd {
    width: 320px;
    background: url(../../i/bg-state-bd.gif) no-repeat bottom;
}
#content-main .exam .resultbox .resultbox-ft .con .case-hd {
    width: 320px;
    padding: 5px 0;
    background: url(../../i/bg-state-hd.gif) no-repeat top;
}
#content-main .exam .resultbox .resultbox-ft .con .case-hd table.tab-water {
    width: 304px;
    margin: 0 0 5px 8px;
}
#content-main .exam .resultbox .resultbox-ft .con .case-hd p {
    padding: 0 15px 0 22px;
}
#content-main .exam .resultbox .resultbox-ft .con .case-hd p.header {
    color: #d78843;
    font: bold 13px/22px Arial;
    margin: 0 0 0 15px;
    padding: 0;
}


#content-main .exam .resultbox .resultbox-ft .radar {
    float: right;
    width: 320px;
    margin: 5px 0 0 0;
    position: relative;
}

#content-main .exam .resultbox .resultbox-ft .radar .photo {
    position: relative;
    _left: 15px;
    
    width: 300px;
    height: 260px;
    margin: 40px 0 0 45px;
    _margin: 40px 0 0 25px;
}

#content-main .exam .resultbox .resultbox-ft .radar .cover {
    position: absolute;
    top: -3px;
    left: 6px;
    _left: 1px;
    width: 270px;
    height: 270px;
}

/**
 *
 * =resultbox
 *
 **/
#content-main .exam .resultbox .desc-bd {
    width: 686px;
    margin: 0 0 10px 15px;
    background: url(../../i/bg-btn-bd.gif) no-repeat bottom;
}
#content-main .exam .resultbox .desc-hd {
    padding: 10px;
    text-align: center;
    background: url(../../i/bg-btn-hd.gif) no-repeat top;
}
#content-main .exam .resultbox .desc-hd p.header {
    font: bold 15px/22px Arial;
    color:#2aaeb0;
}


/**
 *
 * =btn
 *
 **/

#content-main .exam .resultbox .desc-hd ul { 
    width: 243px;
    height: 20px;
    margin: 5px auto;
}
#content-main .exam .resultbox .desc-hd ul li { 
    float: left;
    margin: 0 10px 0 0;
}
#content-main .exam .resultbox .desc-hd button.exam-r {
	float: left;
    display: block;
    width: 124px;
    height: 20px;
    background: url(../../i/btn-resultbox-r.gif) no-repeat;
    text-indent: -100000px;
}
#content-main .exam .resultbox .desc-hd button.print-b {
	float: left;
    display: block;
    width: 99px;
    height: 20px;
    background: url(../../i/btn-print-b.gif) no-repeat;
    text-indent: -100000px;
}



/**
 *
 * =shopbox 
 *
 **/
#content-main .exam .examstart {
    width: 684px;
    height: 174px;
    margin: 5px auto 0 auto;
    padding: 100px 10px 0 30px;
    background: url(../../i/bg-examstart.jpg) no-repeat;
}

#content-main .exam .examstart p {
    margin: 0 0 5px 0;
    font: 13px/22px Arial;
}

#content-main .exam .examstart .start {
    width: 212px;
    height: 34px;
    margin: 0 0 0 0;
    background: url(../../i/btn-examstart.jpg) no-repeat;
    vertical-align: middle;
}